<template>
	<view class="" style="width: 95%;margin: auto;margin-top: 32rpx" v-if="itemData.data.length>0">
	    <view class="diy-activity-assemble">
	    	<view class="assemble-header-left">
	    		超值权益卡
	    	</view>
	    	<view class="assemble-header-right" @click="gotoList">
	    		查看全部
	    		<image src="/static/images/group/arrow_right.png" style="width: 24rpx;margin-left: 6rpx;" mode="widthFix"></image>
	    	</view>
	    </view>
	    <view class="diy-activity-product-list">
	    	<view class="items-block">
	    		<view v-for="(item,index) in itemData.data" class="item">
	    			<benefit-item :item="item"></benefit-item>
	    		</view>
	    	</view>
	    </view>
	</view>
</template>

<script>
	import benefitItem from '../../benefit-item.vue'
export default {
	components: {
		'benefit-item': benefitItem
	},
	data() {
		return {
			diftime: 0
		};
	},
	props: ['itemData'],
	created() {
	},
	methods: {
		scroll(e) {},
		/*跳转列表*/
		gotoList() {
			let url = '/pagesBenefit/benefit/list';
			this.gotoPage(url);
		},
	}
};
</script>

<style lang="scss">
	/* 大图样式 */
	.diy-activity-assemble {
		height: 40rpx;
		overflow: hidden;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-bottom: 30rpx;
		
		.assemble-header-left {
			color: #1B1B1B;
			font-size: 32rpx;
			font-weight: 600;
		}
		
		.assemble-header-right {
			color: #6E6E6E;
			font-size: 24rpx;
			line-height: 24rpx;
			display: flex;
			align-items: center;
		}
	}
	
	.items-block {
		brand-item {
			width: 100%;
			background: #ffffff;
			border-radius: 20rpx;
		}
		.item {
			display: flex;
			border-bottom: 1rpx solid #f2f2f2;
			&:last-child {
				border: none;
			}
			benefit-item {
				width: 100%;
			}
		}
	}
</style>
